<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>Modal Example</title>
    <script src="js/vue.js"></script>
    <link rel="stylesheet" href="css/modal.css">
</head>
<body>
    <div id='app'>
        <button @click="visible=true">打开弹窗</button>
        {{visible}}
        <my-modal @update="val=>visible=val" :value="visible"></my-modal>
    </div>
    <script src="js/modal.js"></script>
    <script>
        Vue.createApp({
            components: {
                'my-modal': modal
            },
            data() {
                return {
                    visible: false
                }
            }
        }).mount('#app')
    </script>
</body>
</html>